<!DOCTYPE html>
<html lang="en">

<head>

  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <title>Mednalytics</title>
  <!-- Iconic Fonts -->
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <link href="../vendors/iconic-fonts/font-awesome/css/all.min.css" rel="stylesheet">
  <link rel="stylesheet" href="../vendors/iconic-fonts/flat-icons/flaticon.css">
  <link rel="stylesheet" href="../vendors/iconic-fonts/cryptocoins/cryptocoins.css">
  <link rel="stylesheet" href="../vendors/iconic-fonts/cryptocoins/cryptocoins-colors.css">
  <!-- Bootstrap core CSS -->
  <link href="../assets/css/bootstrap.min.css" rel="stylesheet">
  <!-- jQuery UI -->
  <link href="../assets/css/jquery-ui.min.css" rel="stylesheet">
  <!-- Mednalytics Core styles -->
  <link href="../assets/css/style.css" rel="stylesheet">

  <!-- Favicon -->
  <link rel="icon" type="image/png" sizes="32x32" href="../favicon.ico">

</head>

<body class="ms-body ms-aside-left-open ms-primary-theme ms-has-quickbar">

  <!-- Setting Panel -->
  <div class="ms-toggler ms-settings-toggle ms-d-block-lg">
    <i class="flaticon-gear"></i>
  </div>
  <div class="ms-settings-panel ms-d-block-lg">
    <div class="row">

      <div class="col-xl-4 col-md-4">
        <h4 class="section-title">Customize</h4>
        <div>
          <label class="ms-switch">
             <input type="checkbox" id="dark-mode">
             <span class="ms-switch-slider round"></span>
           </label>
          <span> Dark Mode </span>
        </div>

      </div>
      <div class="col-xl-4 col-md-4">
        <h4 class="section-title">Keyboard Shortcuts</h4>
        <p class="ms-directions mb-0"><code>Esc</code> Close Quick Bar</p>
        <p class="ms-directions mb-0"><code>Alt + (1 -> 6)</code> Open Quick Bar Tab</p>
        <p class="ms-directions mb-0"><code>Alt + Q</code> Enable Quick Bar Configure Mode</p>
      </div>


    </div>
  </div>

  <!-- Preloader -->
  <div id="preloader-wrap">
    <div class="spinner spinner-8">
      <div class="ms-circle1 ms-child"></div>
      <div class="ms-circle2 ms-child"></div>
      <div class="ms-circle3 ms-child"></div>
      <div class="ms-circle4 ms-child"></div>
      <div class="ms-circle5 ms-child"></div>
      <div class="ms-circle6 ms-child"></div>
      <div class="ms-circle7 ms-child"></div>
      <div class="ms-circle8 ms-child"></div>
      <div class="ms-circle9 ms-child"></div>
      <div class="ms-circle10 ms-child"></div>
      <div class="ms-circle11 ms-child"></div>
      <div class="ms-circle12 ms-child"></div>
    </div>
  </div>

  <!-- Overlays -->
  <div class="ms-aside-overlay ms-overlay-left ms-toggler" data-target="#ms-side-nav" data-toggle="slideLeft"></div>
  <div class="ms-aside-overlay ms-overlay-right ms-toggler" data-target="#ms-recent-activity" data-toggle="slideRight"></div>

  <!-- Sidebar Navigation Left -->
  <aside id="ms-side-nav" class="side-nav fixed ms-aside-scrollable ms-aside-left">

    <!-- Logo -->
    <div class="logo-sn ms-d-block-lg">
      <a class="pl-0 ml-0 text-center" href="../index.html"> <img src="../assets/img/mednalytics-logo-216x62.png" alt="logo"> </a>
      <a href="#" class="text-center ms-logo-img-link"> <img src="../assets/img/dashboard/doctor-3.jpg" alt="logo"></a>
      <h5 class="text-center text-white mt-2">Dr.Samuel</h5>
      <h6 class="text-center text-white mb-3">Admin</h6>
    </div>

    <!-- Navigation -->
    <ul class="accordion ms-main-aside fs-14" id="side-nav-accordion">
        <!-- Dashboard -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#dashboard" aria-expanded="false" aria-controls="dashboard">
               <span><i class="material-icons fs-16">dashboard</i>Dashboard </span>
             </a>
            <ul id="dashboard" class="collapse" aria-labelledby="dashboard" data-parent="#side-nav-accordion">
              <li> <a href="../index.html">Mednalytics</a> </li>
            </ul>
        </li>
        <!-- /Dashboard -->


        <!-- Doctor -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#doctor" aria-expanded="false" aria-controls="doctor">
              <span><i class="fas fa-stethoscope"></i>Doctor</span>
            </a>
            <ul id="doctor" class="collapse" aria-labelledby="doctor" data-parent="#side-nav-accordion">
              <li> <a href="doctor/add-doctor.html">Add Doctor</a> </li>
              <li> <a href="doctor/doctor-list.html">Doctor List</a> </li>

            </ul>
        </li>
        <!-- Doctor -->




        <!-- Patient -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#patient" aria-expanded="false" aria-controls="patient">
              <span><i class="fas fa-user"></i>Patient</span>
            </a>
            <ul id="patient" class="collapse" aria-labelledby="patient" data-parent="#side-nav-accordion">
              <li> <a href="patient/add-patient.html">Add Patient</a> </li>
              <li> <a href="patient/patient-list.html">Patient List</a> </li>

            </ul>
        </li>
        <!-- /Patient -->



        <!-- Department -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#department" aria-expanded="false" aria-controls="department">
              <span><i class="fas fa-sitemap"></i>Department</span>
            </a>
            <ul id="department" class="collapse" aria-labelledby="department" data-parent="#side-nav-accordion">
              <li> <a href="department/add-department.html">Add Department</a> </li>
              <li> <a href="department/department-list.html">Department List</a> </li>

            </ul>
        </li>
        <!-- /Department -->

        <!-- Schedule -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#schedule" aria-expanded="false" aria-controls="schedule">
              <span><i class="fas fa-list-alt"></i>Doctor Schedule</span>
            </a>
            <ul id="schedule" class="collapse" aria-labelledby="schedule" data-parent="#side-nav-accordion">
              <li> <a href="doctor-schedule/add-schedule.html">Add Schedule</a> </li>
              <li> <a href="doctor-schedule/schedule-list.html">Schedule List</a> </li>

            </ul>
        </li>
        <!-- /Schedule -->


        <!-- Appointment -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#appointment" aria-expanded="false" aria-controls="appointment">
              <span><i class="far fa-check-square"></i>Appointment</span>
            </a>
            <ul id="appointment" class="collapse" aria-labelledby="appointment" data-parent="#side-nav-accordion">
              <li> <a href="appointment/add-appointment.html">Add Appointment</a> </li>
              <li> <a href="appointment/appointment-list.html">Appointment List</a> </li>

            </ul>
        </li>
        <!-- /Appointment -->


        <!-- Payment -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#payment" aria-expanded="false" aria-controls="payment">
              <span><i class="fas fa-credit-card"></i>Payment</span>
            </a>
            <ul id="payment" class="collapse" aria-labelledby="payment" data-parent="#side-nav-accordion">
              <li> <a href="payment/add-payment.html">Add Payment</a> </li>
              <li> <a href="payment/payment-list.html">Payment List</a> </li>
              <li> <a href="payment/payment-invoice.html">Payment Invoice</a> </li>

            </ul>
        </li>
        <!-- /Payment -->

        <!-- Report -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#report" aria-expanded="false" aria-controls="report">
              <span><i class="fas fa-file-alt"></i>Report</span>
            </a>
            <ul id="report" class="collapse" aria-labelledby="report" data-parent="#side-nav-accordion">
              <li> <a href="report/patient-report.html">Patient Wise Report</a> </li>
              <li> <a href="report/doctor-report.html">Doctor Wise Report</a> </li>
              <li> <a href="report/total-report.html">Total Report</a> </li>

            </ul>
        </li>
        <!-- /Report -->



        <!-- Human Resource -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#human-resource" aria-expanded="false" aria-controls="human-resource">
              <span><i class="far fa-user-circle"></i>Human Resource</span>
            </a>
            <ul id="human-resource" class="collapse" aria-labelledby="human-resource" data-parent="#side-nav-accordion">
              <li> <a href="human-resource/add-employee.html">Add Employee</a> </li>
              <li> <a href="human-resource/employee-list.html">Employee List</a> </li>
              <li> <a href="human-resource/add-nurse.html">Add Nurse</a> </li>
              <li> <a href="human-resource/nurse-list.html">Nurse List</a> </li>
              <li> <a href="human-resource/add-pharmacist.html">Add Pharmacist</a> </li>
              <li> <a href="human-resource/pharmacist-list.html">Pharmacist List</a> </li>
              <li> <a href="human-resource/add-representative.html">Add Representative</a> </li>
              <li> <a href="human-resource/representative-list.html">Representative List</a> </li>
        </ul>
        </li>
        <!-- /Human Resource -->


        <!-- Bed -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#bed" aria-expanded="false" aria-controls="bed">
              <span><i class="fas fa-bed"></i>Bed Manager</span>
            </a>
            <ul id="bed" class="collapse" aria-labelledby="bed" data-parent="#side-nav-accordion">
              <li> <a href="bed-manager/add-bed.html">Add Bed</a> </li>
              <li> <a href="bed-manager/bed-list.html">Bed List</a> </li>

            </ul>
        </li>
        <!-- /Bed-->


        <!-- Notice -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#notice" aria-expanded="false" aria-controls="notice">
              <span><i class="far fa-file-alt"></i>Notice</span>
            </a>
            <ul id="notice" class="collapse" aria-labelledby="notice" data-parent="#side-nav-accordion">
              <li> <a href="notice/add-notice.html">Add Notice</a> </li>
              <li> <a href="notice/notice-list.html">Notice List</a> </li>
            </ul>
        </li>
        <!-- /Notice -->



        <li class="menu-item">
          <a href="widgets.html">
            <span><i class="material-icons fs-16">widgets</i>Widgets</span>
          </a>
        </li>
        <!-- Basic UI Elements -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#basic-elements" aria-expanded="false" aria-controls="basic-elements">
              <span><i class="material-icons fs-16">filter_list</i>Basic UI Elements</span>
            </a>
            <ul id="basic-elements" class="collapse" aria-labelledby="basic-elements" data-parent="#side-nav-accordion">
              <li> <a href="ui-basic/accordions.html">Accordions</a> </li>
              <li> <a href="ui-basic/alerts.html">Alerts</a> </li>
              <li> <a href="ui-basic/buttons.html">Buttons</a> </li>
              <li> <a href="ui-basic/breadcrumbs.html">Breadcrumbs</a> </li>
              <li> <a href="ui-basic/badges.html">Badges</a> </li>
              <li> <a href="ui-basic/cards.html">Cards</a> </li>
              <li> <a href="ui-basic/progress-bars.html">Progress Bars</a> </li>
              <li> <a href="ui-basic/preloaders.html">Pre-loaders</a> </li>
              <li> <a href="ui-basic/pagination.html">Pagination</a> </li>
              <li> <a href="ui-basic/tabs.html">Tabs</a> </li>

              <li> <a href="ui-basic/typography.html">Typography</a> </li>
            </ul>
        </li>
        <!-- /Basic UI Elements -->
        <!-- Advanced UI Elements -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#advanced-elements" aria-expanded="false" aria-controls="advanced-elements">
              <span><i class="material-icons fs-16">code</i>Advanced UI Elements</span>
            </a>
            <ul id="advanced-elements" class="collapse" aria-labelledby="advanced-elements" data-parent="#side-nav-accordion">
              <li> <a href="ui-advanced/draggables.html">Draggables</a> </li>
              <li> <a href="ui-advanced/sliders.html">Sliders</a> </li>
              <li> <a href="ui-advanced/modals.html">Modals</a> </li>
              <li> <a href="ui-advanced/rating.html">Rating</a> </li>
              <li> <a href="ui-advanced/tour.html">Tour</a> </li>
              <li> <a href="ui-advanced/cropper.html">Cropper</a> </li>
              <li> <a href="ui-advanced/range-slider.html">Range Slider</a> </li>
            </ul>
        </li>
        <!-- /Advanced UI Elements -->
        <li class="menu-item">
            <a href="animation.html">
              <span><i class="material-icons fs-16">format_paint</i>Animations</span>
            </a>
        </li>
        <!-- Form Elements -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#form-elements" aria-expanded="false" aria-controls="form-elements">
              <span><i class="material-icons fs-16">input</i>Form Elements</span>
            </a>
            <ul id="form-elements" class="collapse" aria-labelledby="form-elements" data-parent="#side-nav-accordion">
              <li> <a href="form/form-elements.html">Form Elements</a> </li>
              <li> <a href="form/form-layout.html">Form Layouts</a> </li>
              <li> <a href="form/form-validation.html">Form Validation</a> </li>
              <li> <a href="form/form-wizard.html">Form Wizard</a> </li>
            </ul>
        </li>
        <!-- /Form Elements -->
        <!-- Charts -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#charts" aria-expanded="false" aria-controls="charts">
              <span><i class="material-icons fs-16">equalizer</i>Charts</span>
            </a>
            <ul id="charts" class="collapse" aria-labelledby="charts" data-parent="#side-nav-accordion">
              <li> <a href="charts/chartjs.html">Chart JS</a> </li>
              <li> <a href="charts/morris-charts.html">Morris Chart</a> </li>
            </ul>
        </li>
        <!-- /Charts -->
        <!-- Tables -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#tables" aria-expanded="false" aria-controls="tables">
              <span><i class="material-icons fs-16">tune</i>Tables</span>
            </a>
            <ul id="tables" class="collapse" aria-labelledby="tables" data-parent="#side-nav-accordion">
              <li> <a href="tables/basic-tables.html">Basic Tables</a> </li>
              <li> <a href="tables/data-tables.html">Data tables</a> </li>
            </ul>
        </li>
        <!-- /Tables -->
        <!-- Popups -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#popups" aria-expanded="false" aria-controls="popups">
              <span><i class="material-icons fs-16">message</i>Popups</span>
            </a>
            <ul id="popups" class="collapse" aria-labelledby="popups" data-parent="#side-nav-accordion">
              <li> <a href="popups/sweet-alerts.html">Sweet Alerts</a> </li>
              <li> <a href="popups/toast.html">Toast</a> </li>
            </ul>
        </li>
        <!-- /Popups -->
        <!-- Icons -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#icons" aria-expanded="false" aria-controls="icons">
              <span><i class="material-icons fs-16">border_color</i>Icons</span>
            </a>
            <ul id="icons" class="collapse" aria-labelledby="icons" data-parent="#side-nav-accordion">
              <li> <a href="icons/fontawesome.html">Fontawesome</a> </li>
              <li> <a href="icons/flaticons.html">Flaticons</a> </li>
              <li> <a href="icons/materialize.html">Materialize</a> </li>
            </ul>
        </li>
        <!-- /Icons -->
        <!-- Maps -->
        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#maps" aria-expanded="false" aria-controls="maps">
              <span><i class="material-icons fs-16">map</i>Maps</span>
            </a>
            <ul id="maps" class="collapse" aria-labelledby="maps" data-parent="#side-nav-accordion">
              <li> <a href="maps/google-maps.html">Google Maps</a> </li>
              <li> <a href="maps/vector-maps.html">Vector Maps</a> </li>
            </ul>
        </li>
        <!-- /Maps -->
        <!-- Pages -->
        <li class="menu-item">
          <a href="#" class="has-chevron" data-toggle="collapse" data-target="#pages" aria-expanded="false" aria-controls="pages">
            <span><i class="material-icons fs-16">insert_drive_file</i>Pages</span>
          </a>
          <ul id="pages" class="collapse" aria-labelledby="pages" data-parent="#side-nav-accordion">
            <li class="menu-item">
              <a href="#" class="has-chevron" data-toggle="collapse" data-target="#authentication" aria-expanded="false" aria-controls="authentication">Authentication</a>
              <ul id="authentication" class="collapse" aria-labelledby="authentication" data-parent="#pages">
                <li> <a href="prebuilt-pages/default-login.html">Default Login</a> </li>
                <li> <a href="prebuilt-pages/modal-login.html">Modal Login</a> </li>
                <li> <a href="prebuilt-pages/default-register.html">Default Registration</a> </li>
                <li> <a href="prebuilt-pages/modal-register.html">Modal Registration</a> </li>
                <li> <a href="prebuilt-pages/lock-screen.html">Lock Screen</a> </li>
              </ul>
            </li>
            <li> <a href="prebuilt-pages/coming-soon.html">Coming Soon</a> </li>
            <li> <a href="prebuilt-pages/error.html">Error Page</a> </li>
            <li class="menu-item"> <a href="prebuilt-pages/faq.html"> FAQ </a> </li>
            <li class="menu-item"> <a href="prebuilt-pages/portfolio.html"> Portfolio </a> </li>
            <li class="menu-item"> <a href="prebuilt-pages/user-profile.html"> User Profile </a> </li>
            <li class="menu-item"> <a href="prebuilt-pages/invoice.html"> Invoice </a> </li>
          </ul>
        </li>
        <!-- /Pages -->

        <!-- Bonus Pages -->

        <li class="menu-item">
            <a href="#" class="has-chevron" data-toggle="collapse" data-target="#bonus" aria-expanded="false">
               <span><i class="material-icons fs-16">dashboard</i>Bonus Pages </span>
             </a>
            <ul id="bonus" class="collapse"  data-parent="#side-nav-accordion">
              <li> <a href="../pages/dashboard/web-analytics.html"> Web Analytics </a> </li>
              <li> <a href="../pages/dashboard/social-media.html">Social Media Management</a> </li>
              <li> <a href="../pages/dashboard/project-management.html">Department Management</a> </li>
              <li> <a href="../pages/dashboard/client-management.html">Patient Management</a> </li>
            </ul>

        </li>

        <!-- /Bonus Pages -->

        <!-- Apps -->
        <li class="menu-item">
          <a href="#" class="has-chevron" data-toggle="collapse" data-target="#apps" aria-expanded="false" aria-controls="apps">
            <span><i class="material-icons fs-16">phone_iphone</i>Apps</span>
          </a>
          <ul id="apps" class="collapse" aria-labelledby="apps" data-parent="#side-nav-accordion">
            <li> <a href="apps/chat.html">Chat</a> </li>
            <li> <a href="apps/email.html">Email</a> </li>
            <li> <a href="apps/to-do-list.html">To-do List</a> </li>
          </ul>
        </li>
        <!-- /Apps -->
    </ul>


  </aside>

  <!-- Sidebar Right -->
  <aside id="ms-recent-activity" class="side-nav fixed ms-aside-right ms-scrollable">

    <div class="ms-aside-header">
      <ul class="nav nav-tabs tabs-bordered d-flex nav-justified mb-3" role="tablist">
        <li role="presentation" class="fs-12"><a href="#activityLog" aria-controls="activityLog" class="active" role="tab" data-toggle="tab"> Activity Log</a></li>
        <li role="presentation" class="fs-12"><a href="#recentPosts" aria-controls="recentPosts" role="tab" data-toggle="tab"> Settings </a></li>
        <li><button type="button" class="close ms-toggler text-center" data-target="#ms-recent-activity" data-toggle="slideRight"><span aria-hidden="true">&times;</span></button></li>
      </ul>
    </div>

    <div class="ms-aside-body">

       <div class="tab-content">

         <div role="tabpanel" class="tab-pane active fade show" id="activityLog">
           <ul class="ms-activity-log">
             <li>
               <div class="ms-btn-icon btn-pill icon btn-light">
                 <i class="flaticon-gear"></i>
               </div>
               <h6>Update 1.0.0 Pushed</h6>
               <span> <i class="material-icons">event</i>1 January, 2019</span>
               <p class="fs-14">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque scelerisque diam non nisi semper, ula in sodales vehicula....</p>
             </li>
             <li>
               <div class="ms-btn-icon btn-pill icon btn-success">
                 <i class="flaticon-tick-inside-circle"></i>
               </div>
               <h6>Profile Updated</h6>
               <span> <i class="material-icons">event</i>4 March, 2018</span>
               <p class="fs-14">Curabitur purus sem, malesuada eu luctus eget, suscipit sed turpis. Nam pellentesque felis vitae justo accumsan, sed semper nisi sollicitudin...</p>
             </li>
             <li>
               <div class="ms-btn-icon btn-pill icon btn-warning">
                 <i class="flaticon-alert-1"></i>
               </div>
               <h6>Your payment is due</h6>
               <span> <i class="material-icons">event</i>1 January, 2019</span>
               <p class="fs-14">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque scelerisque diam non nisi semper, ula in sodales vehicula....</p>
             </li>
             <li>
               <div class="ms-btn-icon btn-pill icon btn-danger">
                 <i class="flaticon-alert"></i>
               </div>
               <h6>Database Error</h6>
               <span> <i class="material-icons">event</i>4 March, 2018</span>
               <p class="fs-14">Curabitur purus sem, malesuada eu luctus eget, suscipit sed turpis. Nam pellentesque felis vitae justo accumsan, sed semper nisi sollicitudin...</p>
             </li>
             <li>
               <div class="ms-btn-icon btn-pill icon btn-info">
                 <i class="flaticon-information"></i>
               </div>
               <h6>Checkout what's Trending</h6>
               <span> <i class="material-icons">event</i>1 January, 2019</span>
               <p class="fs-14">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque scelerisque diam non nisi semper, ula in sodales vehicula....</p>
             </li>
             <li>
               <div class="ms-btn-icon btn-pill icon btn-secondary">
                 <i class="flaticon-diamond"></i>
               </div>
               <h6>Your Dashboard is ready</h6>
               <span> <i class="material-icons">event</i>4 March, 2018</span>
               <p class="fs-14">Curabitur purus sem, malesuada eu luctus eget, suscipit sed turpis. Nam pellentesque felis vitae justo accumsan, sed semper nisi sollicitudin...</p>
             </li>
           </ul>
           <a href="#" class="btn btn-primary d-block"> View All </a>
         </div>

         <div role="tabpanel" class="tab-pane fade" id="recentPosts">

           <h6>General Settings</h6>
           <div class="ms-form-group">
             <span class="ms-option-name fs-14">Location Tracking</span>
             <label class="ms-switch float-right">
               <input type="checkbox">
               <span class="ms-switch-slider round"></span>
             </label>
           </div>
           <div class="ms-form-group">
             <span class="ms-option-name fs-14">Allow Notifications</span>
             <label class="ms-switch float-right">
               <input type="checkbox">
               <span class="ms-switch-slider round"></span>
             </label>
           </div>
           <div class="ms-form-group">
             <span class="ms-option-name fs-14">Allow Popups</span>
             <label class="ms-switch float-right">
               <input type="checkbox" checked>
               <span class="ms-switch-slider round"></span>
             </label>
           </div>
           <h6>Log Settings</h6>
           <div class="ms-form-group">
             <span class="ms-option-name fs-14">Enable Logging</span>
             <label class="ms-switch float-right">
               <input type="checkbox" checked>
               <span class="ms-switch-slider round"></span>
             </label>
           </div>
           <div class="ms-form-group">
             <span class="ms-option-name fs-14">Audit Logs</span>
             <label class="ms-switch float-right">
               <input type="checkbox">
               <span class="ms-switch-slider round"></span>
             </label>
           </div>
           <div class="ms-form-group">
             <span class="ms-option-name fs-14">Error Logs</span>
             <label class="ms-switch float-right">
               <input type="checkbox" checked>
               <span class="ms-switch-slider round"></span>
             </label>
           </div>
           <h6>Advanced Settings</h6>
           <div class="ms-form-group">
             <span class="ms-option-name fs-14">Enable Logging</span>
             <label class="ms-switch float-right">
               <input type="checkbox" checked>
               <span class="ms-switch-slider round"></span>
             </label>
           </div>
           <div class="ms-form-group">
             <span class="ms-option-name fs-14">Audit Logs</span>
             <label class="ms-switch float-right">
               <input type="checkbox">
               <span class="ms-switch-slider round"></span>
             </label>
           </div>
           <div class="ms-form-group">
             <span class="ms-option-name fs-14">Error Logs</span>
             <label class="ms-switch float-right">
               <input type="checkbox" checked>
               <span class="ms-switch-slider round"></span>
             </label>
           </div>

         </div>

       </div>

    </div>

  </aside>

  <!-- Main Content -->
  <main class="body-content">

    <!-- Navigation Bar -->
    <nav class="navbar ms-navbar">

      <div class="ms-aside-toggler ms-toggler pl-0" data-target="#ms-side-nav" data-toggle="slideLeft">
        <span class="ms-toggler-bar bg-white"></span>
        <span class="ms-toggler-bar bg-white"></span>
        <span class="ms-toggler-bar bg-white"></span>
      </div>

      <div class="logo-sn logo-sm ms-d-block-sm">
        <a class="pl-0 ml-0 text-center navbar-brand mr-0" href="../index.html"><img src="../assets/img/mednalytics-logo-84x41.png" alt="logo"> </a>
      </div>

      <ul class="ms-nav-list ms-inline mb-0" id="ms-nav-options">
        <li class="ms-nav-item  ms-d-none">
          <a href="#mymodal" class="text-white" data-toggle="modal"><i class="flaticon-spreadsheet mr-2"></i> Make an appointment</a>
        </li>

        <li class="ms-nav-item ms-d-none">
          <a href="#prescription" class="text-white" data-toggle="modal"><i class="flaticon-pencil mr-2"></i> Write a prescription</a>
        </li>

        <li class="ms-nav-item ms-d-none">
          <a href="#report1" class="text-white" data-toggle="modal"><i class="flaticon-list mr-2"></i> Generate Report</a>
        </li>

        <li class="ms-nav-item dropdown">
          <a href="#" class="text-disabled ms-has-notification" id="notificationDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="flaticon-bell"></i></a>
          <ul class="dropdown-menu dropdown-menu-right" aria-labelledby="notificationDropdown">
            <li class="dropdown-menu-header">
              <h6 class="dropdown-header ms-inline m-0"><span class="text-disabled">Notifications</span></h6><span class="badge badge-pill badge-info">4 New</span>
            </li>
            <li class="dropdown-divider"></li>
            <li class="ms-scrollable ms-dropdown-list">
              <a class="media p-2" href="#">
                <div class="media-body">
                  <span>12 ways to improve your crypto dashboard</span>
                  <p class="fs-10 my-1 text-disabled"><i class="material-icons">access_time</i> 30 seconds ago</p>
                </div>
              </a>
              <a class="media p-2" href="#">
                <div class="media-body">
                  <span>You have newly registered users</span>
                  <p class="fs-10 my-1 text-disabled"><i class="material-icons">access_time</i> 45 minutes ago</p>
                </div>
              </a>
              <a class="media p-2" href="#">
                <div class="media-body">
                  <span>Your account was logged in from an unauthorized IP</span>
                  <p class="fs-10 my-1 text-disabled"><i class="material-icons">access_time</i> 2 hours ago</p>
                </div>
              </a>
              <a class="media p-2" href="#">
                <div class="media-body">
                  <span>An application form has been submitted</span>
                  <p class="fs-10 my-1 text-disabled"><i class="material-icons">access_time</i> 1 day ago</p>
                </div>
              </a>
            </li>
            <li class="dropdown-divider"></li>
            <li class="dropdown-menu-footer text-center">
              <a href="#">View all Notifications</a>
            </li>
          </ul>
        </li>

        <li class="ms-nav-item ms-nav-user dropdown">
          <a href="#"  id="userDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <img class="ms-user-img ms-img-round float-right" src="../assets/img/dashboard/doctor-1.jpg" alt="people"> </a>
          <ul class="dropdown-menu dropdown-menu-right user-dropdown" aria-labelledby="userDropdown">
            <li class="dropdown-menu-header">
              <h6 class="dropdown-header ms-inline m-0"><span class="text-disabled">Welcome, Dr Samuel Deo</span></h6>
            </li>
            <li class="dropdown-divider"></li>
            <li class="ms-dropdown-list">
              <a class="media fs-14 p-2" href="prebuilt-pages/user-profile.html"> <span><i class="flaticon-user mr-2"></i> Profile</span> </a>
              <a class="media fs-14 p-2" href="apps/email.html"> <span><i class="flaticon-mail mr-2"></i> Inbox</span> <span class="badge badge-pill badge-info">3</span> </a>
              <a class="media fs-14 p-2" href="prebuilt-pages/user-profile.html"> <span><i class="flaticon-gear mr-2"></i> Account Settings</span> </a>
            </li>
            <li class="dropdown-divider"></li>
            <li class="dropdown-menu-footer">
              <a class="media fs-14 p-2" href="prebuilt-pages/lock-screen.html"> <span><i class="flaticon-security mr-2"></i> Lock</span> </a>
            </li>
            <li class="dropdown-menu-footer">
              <a class="media fs-14 p-2" href="prebuilt-pages/default-login.html"> <span><i class="flaticon-shut-down mr-2"></i> Logout</span> </a>
            </li>
          </ul>
        </li>
      </ul>

      <div class="ms-toggler ms-d-block-sm pr-0 ms-nav-toggler" data-toggle="slideDown" data-target="#ms-nav-options">
        <span class="ms-toggler-bar bg-white"></span>
        <span class="ms-toggler-bar bg-white"></span>
        <span class="ms-toggler-bar bg-white"></span>
      </div>

    </nav>

    <!-- Body Content Wrapper -->
    <div class="ms-content-wrapper">
      <div class="row">

        <div class="col-md-12">
          <nav aria-label="breadcrumb">
            <ol class="breadcrumb pl-0">
              <li class="breadcrumb-item"><a href="#"><i class="material-icons">home</i> Home</a></li>
              <li class="breadcrumb-item active" aria-current="page">Widgets</li>
            </ol>
          </nav>
        </div>

        <!-- Infographics Widgets -->
        <div class="col-xl-3 col-md-6">
          <div class="ms-card ms-widget has-graph-full-width ms-infographics-widget">
            <span class="ms-chart-label bg-success"><i class="material-icons">arrow_upward</i> 3.2%</span>
            <div class="ms-card-body media">
              <div class="media-body">
                <span>Upsells Graph</span>
                <h2>8,451</h2>
              </div>
            </div>
            <canvas id="line-chart"></canvas>
          </div>
        </div>
        <div class="col-xl-3 col-md-6">
          <div class="ms-card ms-widget has-graph-full-width ms-infographics-widget">
            <span class="ms-chart-label bg-danger"><i class="material-icons">arrow_downward</i> 4.5%</span>
            <div class="ms-card-body media">
              <div class="media-body">
                <span>Conversions Graph</span>
                <h2>$3,973</h2>
              </div>
            </div>
            <canvas id="line-chart-2"></canvas>
          </div>
        </div>
        <div class="col-xl-3 col-md-6">
          <div class="ms-card ms-widget has-graph-full-width ms-infographics-widget">
            <span class="ms-chart-label bg-success"><i class="material-icons">arrow_upward</i> 12.5%</span>
            <div class="ms-card-body media">
              <div class="media-body">
                <span>Affiliate Graph</span>
                <h2>7,333</h2>
              </div>
            </div>
            <canvas id="line-chart-3"></canvas>
          </div>
        </div>
        <div class="col-xl-3 col-md-6">
          <div class="ms-card ms-widget has-graph-full-width ms-infographics-widget">
            <span class="ms-chart-label bg-success"><i class="material-icons">arrow_upward</i> 9.5%</span>
            <div class="ms-card-body media">
              <div class="media-body">
                <span>Visitor Graph</span>
                <h2>48,973</h2>
              </div>
            </div>
            <canvas id="line-chart-4"></canvas>
          </div>
        </div>

        <!-- Icon cards Widget -->

        <div class="col-xl-3 col-md-6">
          <div class="ms-card card-gradient-success ms-widget ms-infographics-widget">
            <div class="ms-card-body media">
              <div class="media-body">
                <h6>Total Subscriptions</h6>
                <p class="ms-card-change"> <i class="material-icons">arrow_upward</i> 4567</p>
                <p class="fs-12">48% From Last 24 Hours</p>
              </div>
            </div>
            <i class="flaticon-statistics"></i>
          </div>
        </div>
        <div class="col-xl-3 col-md-6">
          <div class="ms-card card-gradient-secondary ms-widget ms-infographics-widget">
            <div class="ms-card-body media">
              <div class="media-body">
                <h6>Budgets</h6>
                <p class="ms-card-change"> $80,950</p>
                <p class="fs-12">2% Decreased from last budget</p>
              </div>
            </div>
            <i class="flaticon-stats"></i>
          </div>
        </div>
        <div class="col-xl-3 col-md-6">
          <div class="ms-card card-gradient-warning ms-widget ms-infographics-widget">
            <div class="ms-card-body media">
              <div class="media-body">
                <h6>Total Users</h6>
                <p class="ms-card-change"> <i class="material-icons">arrow_upward</i> 4567</p>
                <p class="fs-12">48% From Last 24 Hours</p>
              </div>
            </div>
            <i class="flaticon-user"></i>
          </div>
        </div>
        <div class="col-xl-3 col-md-6">
          <div class="ms-card card-gradient-info ms-widget ms-infographics-widget">
            <div class="ms-card-body media">
              <div class="media-body">
                <h6>Conversions</h6>
                <p class="ms-card-change"> $80,950</p>
                <p class="fs-12">2% Decreased from last budget</p>
              </div>
            </div>
            <i class="flaticon-reuse"></i>
          </div>
        </div>

        <!-- Notifications Widgets -->
        <div class="col-xl-3 col-md-6">
          <a href="#">
            <div class="ms-panel ms-panel-hoverable has-border ms-widget ms-has-new-msg ms-notification-widget">
              <span class="msg-count">5</span>
              <div class="ms-panel-body media">
                <i class="material-icons">email</i>
                <div class="media-body">
                  <h6>Email Message</h6>
                  <span>Email App</span>
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-xl-3 col-md-6">
          <a href="#">
            <div class="ms-panel ms-widget ms-panel-hoverable has-border ms-has-new-msg ms-notification-widget">
              <span class="msg-count">5</span>
              <div class="ms-panel-body media">
                <i class="material-icons">person</i>
                <div class="media-body">
                  <h6>Follow Requests</h6>
                  <span>User Profile</span>
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-xl-3 col-md-6">
          <a href="#">
            <div class="ms-panel ms-widget ms-panel-hoverable has-border ms-has-new-msg ms-notification-widget">
              <span class="msg-count">3</span>
              <div class="ms-panel-body media">
                <i class="material-icons">show_chart</i>
                <div class="media-body">
                  <h6>New Sales</h6>
                  <span>Sales</span>
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-xl-3 col-md-6">
          <a href="#">
            <div class="ms-panel ms-widget ms-panel-hoverable has-border ms-has-new-msg ms-notification-widget">
              <span class="msg-count">2</span>
              <div class="ms-panel-body media">
                <i class="material-icons">graphic_eq</i>
                <div class="media-body">
                  <h6>Voicemail</h6>
                  <span>Chat App</span>
                </div>
              </div>
            </div>
          </a>
        </div>

        <!-- User Activity By Country Widget -->
        <div class="col-xl-6 col-md-12">
          <div class="ms-panel ms-widget">
            <div class="ms-panel-header">
              <h6>Top User Activity By Country</h6>
              <p>Users activity performance and bounce rate based on country</p>
            </div>
            <div class="ms-panel-body p-0">
              <div class="table-responsive">
                <table class="table table-hover thead-light">
                  <thead>
                    <tr>
                      <th scope="col">Country</th>
                      <th scope="col">Entrances</th>
                      <th scope="col">Bounce Rate</th>
                      <th scope="col">Exits</th>
                    </tr>
                  </thead>
                  <tbody>
                    <tr>
                      <th scope="row"> <img src="../assets/img/dashboard/widgets/country-1.jpg" alt="flags"></th>
                      <td>725</td>
                      <td>17.24%</td>
                      <td>7.65%</td>
                    </tr>
                    <tr>
                      <th scope="row"> <img src="../assets/img/dashboard/widgets/country-2.jpg" alt="flags"></th>
                      <td>890</td>
                      <td>12.90%</td>
                      <td>9.12%</td>
                    </tr>
                    <tr>
                      <th scope="row"> <img src="../assets/img/dashboard/widgets/country-3.jpg" alt="flags"></th>
                      <td>729</td>
                      <td>20.75%</td>
                      <td>14.29%</td>
                    </tr>
                    <tr>
                      <th scope="row"> <img src="../assets/img/dashboard/widgets/country-4.jpg" alt="flags"></th>
                      <td>316</td>
                      <td>32.09%</td>
                      <td>10.99%</td>
                    </tr>
                    <tr>
                      <th scope="row"> <img src="../assets/img/dashboard/widgets/country-5.jpg" alt="flags"></th>
                      <td>275</td>
                      <td>33.58%</td>
                      <td>6.75%</td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </div>
          </div>
        </div>

        <!-- Trade History Widget -->
        <div class="col-xl-6 col-md-12">
          <div class="ms-panel ms-widget ms-panel-fh">
            <div class="ms-panel-header">
              <h6>Trade History</h6>
              <p>View your trade history</p>
            </div>
            <div class="ms-panel-body p-0">
              <div class="table-responsive">
                <table class="table table-hover thead-light">
                  <thead>
                    <tr>
                      <th scope="col">Price ($)</th>
                      <th scope="col">Amount</th>
                      <th scope="col">Date</th>
                    </tr>
                  </thead>
                  <tbody>
                    <tr>
                      <td>$7860.24</td>
                      <td><i class="cc BTC"></i> 0.528</td>
                      <td>12.01.2019</td>
                    </tr>
                    <tr>
                      <td>$3360.14</td>
                      <td><i class="cc ETH"></i>0.215</td>
                      <td>12.01.2019</td>
                    </tr>
                    <tr>
                      <td>$1264.99</td>
                      <td><i class="cc BTC"></i>0.117</td>
                      <td>12.01.2019</td>
                    </tr>
                    <tr>
                      <td>$3789.31</td>
                      <td><i class="cc PPC-alt"></i>0.217</td>
                      <td>12.01.2019</td>
                    </tr>
                    <tr>
                      <td>$3789.31</td>
                      <td><i class="cc PPC-alt"></i>0.217</td>
                      <td>12.01.2019</td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </div>
          </div>
        </div>

        <!-- Chat Widget -->
        <div class="col-xl-6 col-md-12">
          <div class="ms-panel ms-panel-fh ms-widget ms-chat-conversations">
            <div class="ms-panel-header">
              <div class="ms-chat-header justify-content-between">
                <div class="ms-chat-user-container media clearfix">
                  <div class="ms-chat-status ms-status-online ms-chat-img mr-3 align-self-center">
                    <img src="../assets/img/dashboard/patient-1.jpg" class="ms-img-round" alt="people">
                  </div>
                  <div class="media-body ms-chat-user-info mt-1">
                    <h6>Heather Brown</h6>
                    <span class="text-disabled fs-12">
                      Active Now
                    </span>
                  </div>
                </div>
                <ul class="ms-list ms-list-flex ms-chat-controls">
                  <li data-toggle="tooltip" data-placement="top" title="Call"> <i class="material-icons">local_phone</i> </li>
                  <li data-toggle="tooltip" data-placement="top" title="Video Call"> <i class="material-icons">videocam</i> </li>
                  <li data-toggle="tooltip" data-placement="top" title="Add to Chat"> <i class="material-icons">person_add</i> </li>
                </ul>
              </div>
            </div>
            <div class="ms-panel-body ms-scrollable">
              <div class="ms-chat-bubble ms-chat-message ms-chat-outgoing media clearfix">
                <div class="ms-chat-status ms-status-online ms-chat-img">
                  <img src="../assets/img/dashboard/patient-8.jpg" class="ms-img-round" alt="people">
                </div>
                <div class="media-body">
                  <div class="ms-chat-text">
                    <p>
                      It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.
                      The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters,
                    </p>
                  </div>
                  <p class="ms-chat-time">10:33 pm</p>
                </div>
              </div>
              <div class="ms-chat-bubble ms-chat-message ms-chat-incoming media clearfix">
                <div class="ms-chat-status ms-status-online ms-chat-img">
                  <img src="../assets/img/dashboard/patient-1.jpg" class="ms-img-round" alt="people">
                </div>
                <div class="media-body">
                  <div class="ms-chat-text">
                    <p>
                      The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters,
                    </p>
                  </div>
                  <p class="ms-chat-time">11:01 pm</p>
                </div>
              </div>
            <div class="ms-panel-footer">
              <div class="ms-chat-textbox">
                <ul class="ms-list-flex mb-0">
                  <li class="ms-chat-vn"><i class="material-icons">mic</i> </li>
                  <li class="ms-chat-input">
                    <input type="text" name="msg" placeholder="Enter Message" value="">
                  </li>
                  <li class="ms-chat-text-controls ms-list-flex">
                    <span> <i class="material-icons">tag_faces</i> </span>
                    <span> <i class="material-icons">attach_file</i> </span>
                    <span> <i class="material-icons">camera_alt</i> </span>
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
        </div>

        <!-- Todo Widget -->
        <div class="col-xl-6 col-md-12 ms-deletable ms-todo-list">
          <div class="ms-card ms-widget ms-card-fh">
            <div class="ms-card-header clearfix">
              <h6 class="ms-card-title">Git tasks</h6>
              <button data-toggle="tooltip" data-placement="left" title="Add a Task to this block" class="ms-add-task-to-block ms-btn-icon float-right"> <i class="material-icons text-disabled">add</i> </button>
            </div>
            <div class="ms-card-body">
              <ul class="ms-list ms-task-block">
                <li class="ms-list-item ms-to-do-task ms-deletable">
                  <label class="ms-checkbox-wrap ms-todo-complete">
                    <input type="checkbox" value="">
                    <i class="ms-checkbox-check"></i>
                  </label>
                  <span> Lorem ipsum dolor sit amet </span>
                  <button type="submit" class="close"><i class="flaticon-trash ms-delete-trigger"> </i></button>
                </li>
                <li class="ms-list-item ms-to-do-task ms-deletable">
                  <label class="ms-checkbox-wrap ms-todo-complete">
                    <input type="checkbox" value="">
                    <i class="ms-checkbox-check"></i>
                  </label>
                  <span> Lorem ipsum dolor sit amet </span>
                  <button type="submit" class="close"><i class="flaticon-trash ms-delete-trigger"> </i></button>
                </li>
                <li class="ms-list-item ms-to-do-task ms-deletable">
                  <label class="ms-checkbox-wrap ms-todo-complete">
                    <input type="checkbox" value="">
                    <i class="ms-checkbox-check"></i>
                  </label>
                  <span> Lorem ipsum dolor sit amet </span>
                  <button type="submit" class="close"><i class="flaticon-trash ms-delete-trigger"> </i></button>
                </li>
                <li class="ms-list-item ms-to-do-task ms-deletable">
                  <label class="ms-checkbox-wrap ms-todo-complete">
                    <input type="checkbox" value="">
                    <i class="ms-checkbox-check"></i>
                  </label>
                  <span> Lorem ipsum dolor sit amet </span>
                  <button type="submit" class="close"><i class="flaticon-trash ms-delete-trigger"> </i></button>
                </li>
                <li class="ms-list-item ms-to-do-task ms-deletable">
                  <label class="ms-checkbox-wrap ms-todo-complete">
                    <input type="checkbox" value="">
                    <i class="ms-checkbox-check"></i>
                  </label>
                  <span> Lorem ipsum dolor sit amet </span>
                  <button type="submit" class="close"><i class="flaticon-trash ms-delete-trigger"> </i></button>
                </li>
                <li class="ms-list-item ms-to-do-task ms-deletable">
                  <label class="ms-checkbox-wrap ms-todo-complete">
                    <input type="checkbox" value="">
                    <i class="ms-checkbox-check"></i>
                  </label>
                  <span> Lorem ipsum dolor sit amet </span>
                  <button type="submit" class="close"><i class="flaticon-trash ms-delete-trigger"> </i></button>
                </li>
                <li class="ms-list-item ms-to-do-task ms-deletable">
                  <label class="ms-checkbox-wrap ms-todo-complete">
                    <input type="checkbox" value="">
                    <i class="ms-checkbox-check"></i>
                  </label>
                  <span> Lorem ipsum dolor sit amet </span>
                  <button type="submit" class="close"><i class="flaticon-trash ms-delete-trigger"> </i></button>
                </li>
              </ul>
            </div>
            <div class="ms-card-footer clearfix">
              <a href="#" class="text-disabled mr-2"> <i class="flaticon-archive"> </i> Archive </a>
              <a href="#" class="text-disabled ms-delete-trigger float-right"> <i class="flaticon-trash"> </i> Delete </a>
            </div>
          </div>
        </div>

        <!-- Email Widget -->
        <div class="col-xl-6 col-md-12">
          <div class="ms-panel ms-panel-fh ms-widget ms-email-widget">
            <div class="ms-panel-header">
              <div class="media clearfix">
                <div class="mr-3 align-self-center">
                  <img src="../assets/img/dashboard/patient-1.jpg" class="ms-img-small ms-img-round" alt="people">
                </div>
                <div class="media-body">
                  <h6>Heather Brown</h6>
                </div>
                <ul class="ms-email-options">
                  <li><a href="#" class="text-disabled"> <i class="material-icons">local_offer</i> Tags </a></li>
                  <li><a href="#" class="text-disabled"> <i class="material-icons">folder</i> Folders </a></li>
                </ul>
              </div>

            </div>
            <div class="ms-panel-body">
              <form method="post" class="clearfix">
                  <div class="form-group mb-4">
                    <input type="text" class="form-control" placeholder="Recipients">
                    <div class="ms-cc">
                      <i class="material-icons">person</i> CC & BCC
                    </div>
                  </div>
                  <div class="form-group mb-4">
                    <input type="email" class="form-control" placeholder="Subject">
                  </div>
                  <div class="form-group mb-2">
                    <textarea rows="5" class="form-control" placeholder="Message"></textarea>
                  </div>
                <button class="btn btn-warning  float-right" type="submit">Send Mail</button>
              </form>
            </div>
          </div>
        </div>

        <!-- Crypto Widget -->
        <div class="col-xl-6 col-md-12">
          <div class="ms-panel ms-widget ms-crypto-widget">
            <div class="ms-panel-header">
              <h6>Crypto Market Position</h6>
              <p>Market Value and Position of Cryptocurrency</p>
            </div>
            <div class="ms-panel-body">
              <ul class="nav nav-tabs nav-justified has-gap" role="tablist">
                <li role="presentation" class="fs-12"><a href="#btc" aria-controls="btc" class="active show" role="tab" data-toggle="tab"> BTC </a></li>
                <li role="presentation" class="fs-12"><a href="#xrp" aria-controls="xrp" role="tab" data-toggle="tab"> XRP </a></li>
                <li role="presentation" class="fs-12"><a href="#ltc" aria-controls="ltc" role="tab" data-toggle="tab"> LTC </a></li>
                <li role="presentation" class="fs-12"><a href="#eth" aria-controls="eth" role="tab" data-toggle="tab"> ETH </a></li>
                <li role="presentation" class="fs-12"><a href="#zec" aria-controls="zec" role="tab" data-toggle="tab"> ZEC </a></li>
              </ul>
              <div class="tab-content">
                <div role="tabpanel" class="tab-pane active show fade in" id="btc">
                  <div class="table-responsive">
                    <table class="table table-hover">
                      <thead>
                        <tr>
                          <th scope="col">Country</th>
                          <th scope="col">Value</th>
                          <th scope="col">Position</th>
                          <th scope="col">Volume</th>
                        </tr>
                      </thead>
                      <tbody>
                        <tr>
                          <td>United Kingdom</td>
                          <td>8528.70</td>
                          <td class="ms-text-success">+17.24%</td>
                          <td>7.65%</td>
                        </tr>
                        <tr>
                          <td>United States</td>
                          <td>4867.41</td>
                          <td class="ms-text-danger">-12.24%</td>
                          <td>9.12%</td>
                        </tr>
                        <tr>
                          <td>Australia</td>
                          <td>7538.90</td>
                          <td class="ms-text-success">+32.04%</td>
                          <td>14.29%</td>
                        </tr>
                        <tr>
                          <td>Netherlands</td>
                          <td>1614.19</td>
                          <td class="ms-text-danger">-20.75%</td>
                          <td>12.25%</td>
                        </tr>
                        <tr>
                          <td>Russia</td>
                          <td>3154.19</td>
                          <td class="ms-text-success">+13.38%</td>
                          <td>4.65%</td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                </div>
                <div role="tabpanel" class="tab-pane fade" id="xrp">
                  <div class="table-responsive">
                    <table class="table table-hover">
                      <thead>
                        <tr>
                          <th scope="col">Country</th>
                          <th scope="col">Value</th>
                          <th scope="col">Position</th>
                          <th scope="col">Volume</th>
                        </tr>
                      </thead>
                      <tbody>
                        <tr>
                          <td>United Kingdom</td>
                          <td>7548.70</td>
                          <td class="ms-text-success">+12.24%</td>
                          <td>7.65%</td>
                        </tr>
                        <tr>
                          <td>United States</td>
                          <td>3167.41</td>
                          <td class="ms-text-danger">-4.24%</td>
                          <td>9.12%</td>
                        </tr>
                        <tr>
                          <td>Australia</td>
                          <td>7538.90</td>
                          <td class="ms-text-success">+14.04%</td>
                          <td>14.29%</td>
                        </tr>
                        <tr>
                          <td>Netherlands</td>
                          <td>1614.19</td>
                          <td class="ms-text-danger">-12.75%</td>
                          <td>12.25%</td>
                        </tr>
                        <tr>
                          <td>Russia</td>
                          <td>3154.19</td>
                          <td class="ms-text-success">+44.38%</td>
                          <td>4.65%</td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                </div>
                <div role="tabpanel" class="tab-pane fade" id="ltc">
                  <div class="table-responsive">
                    <table class="table table-hover">
                      <thead>
                        <tr>
                          <th scope="col">Country</th>
                          <th scope="col">Value</th>
                          <th scope="col">Position</th>
                          <th scope="col">Volume</th>
                        </tr>
                      </thead>
                      <tbody>
                        <tr>
                          <td>United Kingdom</td>
                          <td>8528.70</td>
                          <td class="ms-text-success">+17.24%</td>
                          <td>7.65%</td>
                        </tr>
                        <tr>
                          <td>United States</td>
                          <td>4867.41</td>
                          <td class="ms-text-danger">-12.24%</td>
                          <td>9.12%</td>
                        </tr>
                        <tr>
                          <td>Australia</td>
                          <td>7538.90</td>
                          <td class="ms-text-success">+32.04%</td>
                          <td>14.29%</td>
                        </tr>
                        <tr>
                          <td>Netherlands</td>
                          <td>1614.19</td>
                          <td class="ms-text-danger">-20.75%</td>
                          <td>12.25%</td>
                        </tr>
                        <tr>
                          <td>Russia</td>
                          <td>3154.19</td>
                          <td class="ms-text-success">+13.38%</td>
                          <td>4.65%</td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                </div>
                <div role="tabpanel" class="tab-pane fade" id="eth">
                  <div class="table-responsive">
                    <table class="table table-hover">
                      <thead>
                        <tr>
                          <th scope="col">Country</th>
                          <th scope="col">Value</th>
                          <th scope="col">Position</th>
                          <th scope="col">Volume</th>
                        </tr>
                      </thead>
                      <tbody>
                        <tr>
                          <td>United Kingdom</td>
                          <td>7548.70</td>
                          <td class="ms-text-success">+12.24%</td>
                          <td>7.65%</td>
                        </tr>
                        <tr>
                          <td>United States</td>
                          <td>3167.41</td>
                          <td class="ms-text-danger">-4.24%</td>
                          <td>9.12%</td>
                        </tr>
                        <tr>
                          <td>Australia</td>
                          <td>7538.90</td>
                          <td class="ms-text-success">+14.04%</td>
                          <td>14.29%</td>
                        </tr>
                        <tr>
                          <td>Netherlands</td>
                          <td>1614.19</td>
                          <td class="ms-text-danger">-12.75%</td>
                          <td>12.25%</td>
                        </tr>
                        <tr>
                          <td>Russia</td>
                          <td>3154.19</td>
                          <td class="ms-text-success">+44.38%</td>
                          <td>4.65%</td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                </div>
                <div role="tabpanel" class="tab-pane fade" id="zec">
                  <div class="table-responsive">
                    <table class="table table-hover">
                      <thead>
                        <tr>
                          <th scope="col">Country</th>
                          <th scope="col">Value</th>
                          <th scope="col">Position</th>
                          <th scope="col">Volume</th>
                        </tr>
                      </thead>
                      <tbody>
                        <tr>
                          <td>United Kingdom</td>
                          <td>8528.70</td>
                          <td class="ms-text-success">+17.24%</td>
                          <td>7.65%</td>
                        </tr>
                        <tr>
                          <td>United States</td>
                          <td>4867.41</td>
                          <td class="ms-text-danger">-12.24%</td>
                          <td>9.12%</td>
                        </tr>
                        <tr>
                          <td>Australia</td>
                          <td>7538.90</td>
                          <td class="ms-text-success">+32.04%</td>
                          <td>14.29%</td>
                        </tr>
                        <tr>
                          <td>Netherlands</td>
                          <td>1614.19</td>
                          <td class="ms-text-danger">-20.75%</td>
                          <td>12.25%</td>
                        </tr>
                        <tr>
                          <td>Russia</td>
                          <td>3154.19</td>
                          <td class="ms-text-success">+13.38%</td>
                          <td>4.65%</td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                </div>
              </div>

            </div>
          </div>
        </div>

          <!-- Chat Widget (Active Chats) -->
        <div class="col-xl-4 col-md-12">
          <div class="ms-panel ms-widget ">
            <div class="ms-panel-body py-3 px-0">
              <div class="ms-chat-container">

                <div class="ms-chat-header px-3">
                  <div class="ms-chat-user-container media clearfix">
                    <div class="ms-chat-status ms-status-online ms-chat-img mr-3 align-self-center">
                      <img src="../assets/img/dashboard/patient-8.jpg" class="ms-img-round" alt="people">
                    </div>
                    <div class="media-body ms-chat-user-info mt-1">
                      <h6>Anny Farisha</h6>
                      <a href="#" class="text-disabled has-chevron fs-12" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        Available
                      </a>
                      <ul class="dropdown-menu">
                        <li class="ms-dropdown-list">
                          <a class="media p-2" href="#">
                            <div class="media-body">
                              <span>Busy</span>
                            </div>
                          </a>
                          <a class="media p-2" href="#">
                            <div class="media-body">
                              <span>Away</span>
                            </div>
                          </a>
                          <a class="media p-2" href="#">
                            <div class="media-body">
                              <span>Offline</span>
                            </div>
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                  <form class="ms-form my-3" method="post">
                    <div class="ms-form-group my-0 mb-0 has-icon fs-14">
                      <input type="search" class="ms-form-input w-100" name="search" placeholder="Search for People and Groups" value="">
                      <i class="flaticon-search text-disabled"></i>
                    </div>
                  </form>
                </div>

                <div class="ms-chat-body">
                  <ul class="nav nav-tabs tabs-bordered d-flex nav-justified px-3" role="tablist">
                    <li role="presentation" class="fs-12"><a href="#chats-2"  class="active show" role="tab" data-toggle="tab"> Chats </a></li>
                    <li role="presentation" class="fs-12"><a href="#groups-2"  role="tab" data-toggle="tab"> Groups </a></li>
                    <li role="presentation" class="fs-12"><a href="#contacts-2"  role="tab" data-toggle="tab"> Contacts </a></li>
                  </ul>

                  <div class="tab-content">
                    <div role="tabpanel" class="tab-pane active show fade in" id="chats-2">
                      <ul class="ms-scrollable">
                        <li class="ms-chat-user-container ms-open-chat ms-deletable p-3 media clearfix">
                          <div class="ms-chat-status ms-status-away ms-has-new-msg ms-chat-img mr-3 align-self-center">
                            <span class="msg-count">3</span>
                            <img src="../assets/img/dashboard/patient-1.jpg" class="ms-img-round" alt="people">
                          </div>
                          <div class="media-body ms-chat-user-info mt-1">
                            <h6>John Doe</h6> <span class="ms-chat-time">2 Hours ago</span>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In in arcu turpis. Nunc</p>
                            <a href="#" class="ms-hoverable-dropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                              <i class="material-icons">more_vert</i>
                            </a>
                            <ul class="dropdown-menu dropdown-menu-right">
                              <li class="ms-dropdown-list">
                                <a class="media p-2" href="#">
                                  <div class="media-body">
                                    <span>Archive</span>
                                  </div>
                                </a>
                                <a class="media p-2" href="#">
                                  <div class="media-body">
                                    <span>Pin</span>
                                  </div>
                                </a>
                                <a class="media p-2" href="#">
                                  <div class="media-body">
                                    <span>Delete</span>
                                  </div>
                                </a>
                              </li>
                            </ul>
                          </div>
                        </li>
                        <li class="ms-chat-user-container ms-open-chat ms-deletable p-3 media clearfix">
                          <div class="ms-chat-status ms-status-online ms-chat-img mr-3 align-self-center">
                            <img src="../assets/img/dashboard/patient-3.jpg" class="ms-img-round" alt="people">
                          </div>
                          <div class="media-body ms-chat-user-info mt-1">
                            <h6>John Doe</h6> <span class="ms-chat-time">3 Days ago</span>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In in arcu turpis. Nunc</p>
                            <a href="#" class="ms-hoverable-dropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                              <i class="material-icons">more_vert</i>
                            </a>
                            <ul class="dropdown-menu dropdown-menu-right">
                              <li class="ms-dropdown-list">
                                <a class="media p-2" href="#">
                                  <div class="media-body">
                                    <span>Archive</span>
                                  </div>
                                </a>
                                <a class="media p-2" href="#">
                                  <div class="media-body">
                                    <span>Pin</span>
                                  </div>
                                </a>
                                <a class="media p-2" href="#">
                                  <div class="media-body">
                                    <span>Delete</span>
                                  </div>
                                </a>
                              </li>
                            </ul>
                          </div>
                        </li>
                        <li class="ms-chat-user-container ms-open-chat ms-deletable p-3 media clearfix">
                          <div class="ms-chat-status ms-status-online ms-chat-img mr-3 align-self-center">
                            <img src="../assets/img/dashboard/doctor-1.jpg" class="ms-img-round" alt="people">
                          </div>
                          <div class="media-body ms-chat-user-info mt-1">
                            <h6>John Doe</h6> <span class="ms-chat-time">3 Days ago</span>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In in arcu turpis. Nunc</p>
                            <a href="#" class="ms-hoverable-dropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                              <i class="material-icons">more_vert</i>
                            </a>
                            <ul class="dropdown-menu dropdown-menu-right">
                              <li class="ms-dropdown-list">
                                <a class="media p-2" href="#">
                                  <div class="media-body">
                                    <span>Archive</span>
                                  </div>
                                </a>
                                <a class="media p-2" href="#">
                                  <div class="media-body">
                                    <span>Pin</span>
                                  </div>
                                </a>
                                <a class="media p-2" href="#">
                                  <div class="media-body">
                                    <span>Delete</span>
                                  </div>
                                </a>
                              </li>
                            </ul>
                          </div>
                        </li>
                        <li class="ms-chat-user-container ms-open-chat ms-deletable p-3 media clearfix">
                          <div class="ms-chat-status ms-status-online ms-chat-img mr-3 align-self-center">
                            <img src="../assets/img/dashboard/doctor-3.jpg" class="ms-img-round" alt="people">
                          </div>
                          <div class="media-body ms-chat-user-info mt-1">
                            <h6>John Doe</h6> <span class="ms-chat-time">3 Days ago</span>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In in arcu turpis. Nunc</p>
                            <a href="#" class="ms-hoverable-dropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                              <i class="material-icons">more_vert</i>
                            </a>
                            <ul class="dropdown-menu dropdown-menu-right">
                              <li class="ms-dropdown-list">
                                <a class="media p-2" href="#">
                                  <div class="media-body">
                                    <span>Archive</span>
                                  </div>
                                </a>
                                <a class="media p-2" href="#">
                                  <div class="media-body">
                                    <span>Pin</span>
                                  </div>
                                </a>
                                <a class="media p-2" href="#">
                                  <div class="media-body">
                                    <span>Delete</span>
                                  </div>
                                </a>
                              </li>
                            </ul>
                          </div>
                        </li>
                      </ul>
                    </div>
                    <div role="tabpanel" class="tab-pane fade" id="groups-2">
                      <ul class="ms-scrollable">
                        <li class="ms-chat-user-container ms-open-chat p-3 media clearfix">
                          <div class="ms-chat-img mr-3 align-self-center">
                            <img src="../assets/img/dashboard/doctor-1.jpg" class="ms-img-round" alt="people">
                          </div>
                          <div class="media-body ms-chat-user-info mt-1">
                            <h6>John Doe</h6> <a href="#" class="ms-chat-time"> <i class="flaticon-chat"></i> </a>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In in arcu turpis. Nunc</p>
                            <ul class="ms-group-members clearfix mt-3 mb-0">
                              <li> <img src="../assets/img/dashboard/doctor-2.jpg" alt="member"> </li>
                              <li> <img src="../assets/img/dashboard/doctor-3.jpg" alt="member"> </li>
                              <li> <img src="../assets/img/dashboard/doctor-4.jpg" alt="member"> </li>
                              <li class="ms-group-count"> + 12 more </li>
                            </ul>
                          </div>
                        </li>
                        <li class="ms-chat-user-container ms-open-chat p-3 media clearfix">
                          <div class="ms-chat-img mr-3 align-self-center">
                            <img src="../assets/img/dashboard/doctor-5.jpg" class="ms-img-round" alt="people">
                          </div>
                          <div class="media-body ms-chat-user-info mt-1">
                            <h6>John Doe</h6> <a href="#" class="ms-chat-time"> <i class="flaticon-chat"></i> </a>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In in arcu turpis. Nunc</p>
                            <ul class="ms-group-members clearfix mt-3 mb-0">
                              <li> <img src="../assets/img/dashboard/doctor-1.jpg" alt="member"> </li>
                              <li> <img src="../assets/img/dashboard/doctor-2.jpg" alt="member"> </li>
                            </ul>
                          </div>
                        </li>
                        <li class="ms-chat-user-container ms-open-chat p-3 media clearfix">
                          <div class="ms-chat-img mr-3 align-self-center">
                            <img src="../assets/img/dashboard/doctor-1.jpg" class="ms-img-round" alt="people">
                          </div>
                          <div class="media-body ms-chat-user-info mt-1">
                            <h6>John Doe</h6> <a href="#" class="ms-chat-time"> <i class="flaticon-chat"></i> </a>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In in arcu turpis. Nunc</p>
                            <ul class="ms-group-members clearfix mt-3 mb-0">
                              <li> <img src="../assets/img/dashboard/doctor-2.jpg" alt="member"> </li>
                              <li> <img src="../assets/img/dashboard/doctor-3.jpg" alt="member"> </li>
                              <li> <img src="../assets/img/dashboard/doctor-4.jpg" alt="member"> </li>
                              <li class="ms-group-count"> + 4 more </li>
                            </ul>
                          </div>
                        </li>
                      </ul>
                    </div>
                    <div role="tabpanel" class="tab-pane fade" id="contacts-2">
                      <ul class="ms-scrollable">
                        <li class="ms-chat-user-container ms-open-chat p-3 media clearfix">
                          <div class="ms-chat-img mr-3 align-self-center">
                            <img src="../assets/img/dashboard/doctor-5.jpg" class="ms-img-round" alt="people">
                          </div>
                          <div class="media-body ms-chat-user-info mt-1">
                            <h6>John Doe</h6> <a href="#" class="ms-chat-time"> <i class="flaticon-chat"></i> </a>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In in arcu turpis. Nunc</p>
                          </div>
                        </li>
                        <li class="ms-chat-user-container ms-open-chat p-3 media clearfix">
                          <div class="ms-chat-img mr-3 align-self-center">
                            <img src="../assets/img/dashboard/doctor-1.jpg" class="ms-img-round" alt="people">
                          </div>
                          <div class="media-body ms-chat-user-info mt-1">
                            <h6>John Doe</h6> <a href="#" class="ms-chat-time"> <i class="flaticon-chat"></i> </a>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In in arcu turpis. Nunc</p>
                          </div>
                        </li>
                        <li class="ms-chat-user-container ms-open-chat p-3 media clearfix">
                          <div class="ms-chat-img mr-3 align-self-center">
                            <img src="../assets/img/dashboard/doctor-2.jpg" class="ms-img-round" alt="people">
                          </div>
                          <div class="media-body ms-chat-user-info mt-1">
                            <h6>John Doe</h6> <a href="#" class="ms-chat-time"> <i class="flaticon-chat"></i> </a>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In in arcu turpis. Nunc</p>
                          </div>
                        </li>
                        <li class="ms-chat-user-container ms-open-chat p-3 media clearfix">
                          <div class="ms-chat-img mr-3 align-self-center">
                            <img src="../assets/img/dashboard/doctor-3.jpg" class="ms-img-round" alt="people">
                          </div>
                          <div class="media-body ms-chat-user-info mt-1">
                            <h6>John Doe</h6> <a href="#" class="ms-chat-time"> <i class="flaticon-chat"></i> </a>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In in arcu turpis. Nunc</p>
                          </div>
                        </li>
                      </ul>
                    </div>
                  </div>

                </div>

              </div>
            </div>
          </div>
        </div>

        <!-- Followers Widget -->
        <div class="col-xl-4 col-md-12">
          <div class="ms-panel ms-panel-fh ms-widget">
            <div class="ms-panel-header">
              <h6>Followers</h6>
            </div>
            <div class="ms-panel-body p-0">
              <ul class="ms-followers ms-list ms-scrollable">
                <li class="ms-list-item media">
                  <img src="../assets/img/dashboard/doctor-1.jpg" class="ms-img-small ms-img-round" alt="people">
                  <div class="media-body mt-1">
                    <h4>Nathaniel Bustos</h4>
                    <span class="fs-12">UI doctor</span>
                  </div>
                  <button type="button" class="ms-btn-icon btn-success" name="button"><i class="material-icons">check</i> </button>
                </li>
                <li class="ms-list-item media">
                  <img src="../assets/img/dashboard/doctor-2.jpg" class="ms-img-small ms-img-round" alt="people">
                  <div class="media-body mt-1">
                    <h4>Anny Farisha</h4>
                    <span class="fs-12">UI doctor</span>
                  </div>
                  <button type="button" class="ms-btn-icon btn-warning" name="button"><i class="material-icons">person_add</i> </button>
                </li>
                <li class="ms-list-item media">
                  <img src="../assets/img/dashboard/doctor-3.jpg" class="ms-img-small ms-img-round" alt="people">
                  <div class="media-body mt-1">
                    <h4>James Zathila</h4>
                    <span class="fs-12">UI doctor</span>
                  </div>
                  <button type="button" class="ms-btn-icon btn-warning" name="button"><i class="material-icons">person_add</i> </button>
                </li>
                <li class="ms-list-item media">
                  <img src="../assets/img/dashboard/doctor-4.jpg" class="ms-img-small ms-img-round" alt="people">
                  <div class="media-body mt-1">
                    <h4>John Doe</h4>
                    <span class="fs-12">UI doctor</span>
                  </div>
                  <button type="button" class="ms-btn-icon btn-success" name="button"><i class="material-icons">check</i> </button>
                </li>
                <li class="ms-list-item media">
                  <img src="../assets/img/dashboard/doctor-5.jpg" class="ms-img-small ms-img-round" alt="people">
                  <div class="media-body mt-1">
                    <h4>Khadiza Rehna</h4>
                    <span class="fs-12">UI doctor</span>
                  </div>
                  <button type="button" class="ms-btn-icon btn-warning" name="button"><i class="material-icons">person_add</i> </button>
                </li>
                <li class="ms-list-item media">
                  <img src="../assets/img/dashboard/doctor-3.jpg" class="ms-img-small ms-img-round" alt="people">
                  <div class="media-body mt-1">
                    <h4>Peter Amber</h4>
                    <span class="fs-12">UI doctor</span>
                  </div>
                  <button type="button" class="ms-btn-icon btn-success" name="button"><i class="material-icons">check</i> </button>
                </li>
                <li class="ms-list-item media">
                  <img src="../assets/img/dashboard/doctor-2.jpg" class="ms-img-small ms-img-round" alt="people">
                  <div class="media-body mt-1">
                    <h4>Helen Southern</h4>
                    <span class="fs-12">UI doctor</span>
                  </div>
                  <button type="button" class="ms-btn-icon btn-success" name="button"><i class="material-icons">check</i> </button>
                </li>
              </ul>
            </div>
          </div>
        </div>

        <!-- User Profile Widget -->
        <div class="col-xl-4 col-md-12">
          <div class="ms-card ms-widget ms-profile-widget ms-card-fh">
            <div class="ms-card-img">
              <img src="../assets/img/dashboard/doctor-banner-1000x370.jpg" alt="card_img">
            </div>
            <img src="../assets/img/dashboard/doctor-2.jpg " class="ms-img-large ms-img-round ms-user-img" alt="people">
            <div class="ms-card-body">
              <h2>Anny Farisha</h2>
              <span>Web Developer</span>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In in arcu turpis. Nunc</p>
              <button type="button" class="btn btn-gradient-primary" name="button"><i class="material-icons">person_add</i> Follow</button>
              <ul class="ms-profile-stats">
                <li>
                  <h3 class="ms-count">5790</h3>
                  <span>Followers</span>
                </li>
                <li>
                  <h3 class="ms-count">4.8</h3>
                  <span>User Rating</span>
                </li>
              </ul>
            </div>
          </div>
        </div>

        <!-- Identifiers -->
        <div class="col-md-4">
          <div class="ms-panel ms-widget ms-identifier-widget bg-danger">
            <div class="ms-panel-header header-mini">
              <h6>Danger</h6>
            </div>
            <div class="ms-panel-body">
              <div class="text-center">
                <i class="flaticon-alert-1"></i>
                <p>Lorem ipsum dolor sit amet,consectetuer edipiscing elit,sed diam nonummy euismod tinciduntut laoreet doloremagna</p>
              </div>
            </div>
          </div>
        </div>
        <div class="col-md-4">
          <div class="ms-panel ms-widget ms-identifier-widget bg-warning">
            <div class="ms-panel-header header-mini">
              <h6>Warning</h6>
            </div>
            <div class="ms-panel-body">
              <div class="text-center">
                <i class="flaticon-alert"></i>
                <p>Lorem ipsum dolor sit amet,consectetuer edipiscing elit,sed diam nonummy euismod tinciduntut laoreet doloremagna</p>
              </div>
            </div>
          </div>
        </div>
        <div class="col-md-4">
          <div class="ms-panel ms-widget ms-identifier-widget bg-info">
            <div class="ms-panel-header header-mini">
              <h6>Info</h6>
            </div>
            <div class="ms-panel-body">
              <div class="text-center">
                <i class="flaticon-information"></i>
                <p>Lorem ipsum dolor sit amet,consectetuer edipiscing elit,sed diam nonummy euismod tinciduntut laoreet doloremagna</p>
              </div>
            </div>
          </div>
        </div>

      </div>
    </div>

  </main>



  <!-- Reminder Modal -->
  <div class="modal fade" id="reminder-modal" tabindex="-1" role="dialog" aria-labelledby="reminder-modal">
    <div class="modal-dialog modal-dialog-centered" role="document">
      <div class="modal-content">

        <div class="modal-header bg-secondary">
          <h5 class="modal-title has-icon text-white"> New Reminder</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        </div>

        <form>

        <div class="modal-body">

          <div class="ms-form-group">
            <label>Remind me about</label>
            <textarea class="form-control" name="reminder"></textarea>
          </div>

          <div class="ms-form-group">
            <span class="ms-option-name fs-14">Repeat Daily</span>
            <label class="ms-switch float-right">
              <input type="checkbox">
              <span class="ms-switch-slider round"></span>
            </label>
          </div>

          <div class="row">
            <div class="col-md-6">
              <div class="ms-form-group">
                <input type="text" class="form-control datepicker" name="reminder-date" value="" />
              </div>
            </div>
            <div class="col-md-6">
              <div class="ms-form-group">
                <select class="form-control" name="reminder-time">
                  <option value="">12:00 pm</option>
                  <option value="">1:00 pm</option>
                  <option value="">2:00 pm</option>
                  <option value="">3:00 pm</option>
                  <option value="">4:00 pm</option>
                </select>
              </div>
            </div>
          </div>

        </div>

        <div class="modal-footer">
          <button type="button" class="btn btn-light" data-dismiss="modal">Close</button>
          <button type="button" class="btn btn-secondary shadow-none" data-dismiss="modal">Add Reminder</button>
        </div>

        </form>

      </div>
    </div>
  </div>

  <!-- Notes Modal -->
  <div class="modal fade" id="notes-modal" tabindex="-1" role="dialog" aria-labelledby="notes-modal">
    <div class="modal-dialog modal-dialog-centered" role="document">
      <div class="modal-content">

        <div class="modal-header bg-secondary">
          <h5 class="modal-title has-icon text-white" id="NoteModal">New Note</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        </div>

        <form>

        <div class="modal-body">

          <div class="ms-form-group">
            <label>Note Title</label>
            <input type="text" class="form-control" name="note-title" value="">
          </div>

          <div class="ms-form-group">
            <label>Note Description</label>
            <textarea class="form-control" name="note-description"></textarea>
          </div>

        </div>

        <div class="modal-footer">
          <button type="button" class="btn btn-light" data-dismiss="modal">Close</button>
          <button type="button" class="btn btn-secondary shadow-none" data-dismiss="modal">Add Note</button>
        </div>

        </form>

      </div>
    </div>
  </div>

  <!-- Modal -->
  <div class="modal fade" id="mymodal" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog ms-modal-dialog-width">
      <div class="modal-content ms-modal-content-width">
        <div class="modal-header  ms-modal-header-radius-0">
          <h4 class="modal-title text-white">Make An Appointment</h4>
          <button type="button" class="close text-white" data-dismiss="modal" aria-hidden="true">x</button>

        </div>
        <div class="modal-body p-0 text-left">
          <div class="col-xl-12 col-md-12">
            <div class="ms-panel ms-panel-bshadow-none">
              <div class="ms-panel-header">
                <h6>Patient Information</h6>
              </div>
              <div class="ms-panel-body">
                <form class="needs-validation" novalidate>
                  <div class="form-row">
                    <div class="col-md-4 mb-3">
                      <label for="validationCustom01">Patient Name</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom01" placeholder="Enter Name" required>

                      </div>
                    </div>
                    <div class="col-md-4 mb-3">
                      <label for="validationCustom02">Date Of Birth</label>
                      <div class="input-group">
                        <input type="number" class="form-control" id="validationCustom02" required>

                      </div>
                    </div>
                    <div class="col-md-4 mb-3">
                      <label for="validationCustom03">Disease</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom03" placeholder="Disease" required>

                      </div>
                    </div>
                  </div>
                  <div class="form-row">
                    <div class="col-md-4 mb-2">
                      <label for="validationCustom04">Address</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom04" placeholder="Add Address" required>

                      </div>
                    </div>
                    <div class="col-md-4 mb-3">
                      <label for="validationCustom05">Phone no.</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom05" placeholder="Enter Phone No." required>

                      </div>

                    </div>

                    <div class="col-md-4 mb-3">
                      <label for="validationCustom06">Department Name</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom06" placeholder="Enter Department Name" required>

                      </div>
                    </div>
                  </div>



                  <div class="form-row">
                    <div class="col-md-4 mb-3">
                      <label for="validationCustom07">Appointment With</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom07" placeholder="Enter Doctor Name" required>

                      </div>
                    </div>
                    <div class="col-md-4 mb-3">
                      <label for="validationCustom08">Appointment Date</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom08" placeholder="Enter Appointment Date" required>

                      </div>
                    </div>
                    <div class="col-md-4 mb-3">
                      <label>Sex</label>
                      <ul class="ms-list d-flex">
                        <li class="ms-list-item pl-0">
                          <label class="ms-checkbox-wrap">
                            <input type="radio" name="radioExample" value="">
                            <i class="ms-checkbox-check"></i>
                          </label>
                          <span> Male </span>
                        </li>
                        <li class="ms-list-item">
                          <label class="ms-checkbox-wrap">
                            <input type="radio" name="radioExample" value="" checked="">
                            <i class="ms-checkbox-check"></i>
                          </label>
                          <span> Female </span>
                        </li>
                      </ul>
                    </div>
                  </div>
                  <button class="btn btn-warning mt-4 d-inline w-20" type="submit">Reset</button>
                  <button class="btn btn-primary mt-4 d-inline w-20" type="submit">Add Appointment</button>
                </form>
              </div>

            </div>
          </div>
        </div>

      </div>
    </div>
  </div>


  <!-- Modal -->
  <div class="modal fade" id="prescription" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog ms-modal-dialog-width">
      <div class="modal-content ms-modal-content-width">
        <div class="modal-header  ms-modal-header-radius-0">
          <h4 class="modal-title text-white">Make a prescription</h4>
          <button type="button" class="close  text-white" data-dismiss="modal" aria-hidden="true">x</button>

        </div>
        <div class="modal-body p-0 text-left">
          <div class="col-xl-12 col-md-12">
            <div class="ms-panel ms-panel-bshadow-none">
              <div class="ms-panel-header">
                <h6>Patient Information</h6>
              </div>
              <div class="ms-panel-body">
                <form class="needs-validation" novalidate>
                  <div class="form-row">
                    <div class="col-md-4 mb-3">
                      <label for="validationCustom09">Patient Name</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom09" placeholder="Enter Name" required>

                      </div>
                    </div>
                    <div class="col-md-4 mb-3">
                      <label for="validationCustom10">Date Of Birth</label>
                      <div class="input-group">
                        <input type="number" class="form-control" id="validationCustom10" required>

                      </div>
                    </div>
                    <div class="col-md-4 mb-2">
                      <label for="validationCustom11">Address</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom11" placeholder="Add Address" required>

                      </div>
                    </div>

                  </div>
                  <div class="form-row">
                    <div class="col-md-4 mb-3">
                      <label for="validationCustom12">Phone no.</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom12" placeholder="Enter Phone No." required>

                      </div>

                    </div>

                    <div class="col-md-4 mb-3">
                      <label for="validationCustom13">Medication</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom13" placeholder="Acetaminophen" required>

                      </div>
                    </div>
                    <div class="col-md-4 mb-3">
                      <label for="validationCustom14">Period Of medication</label>
                      <div class="input-group">
                        <input type="number" class="form-control" id="validationCustom14" placeholder="" required>

                      </div>
                    </div>
                  </div>



                  <div class="form-row">

                    <div class="col-md-4 mb-3">
                      <label for="validationCustom15">Appointment With</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom15" placeholder="Enter Doctor Name" required>

                      </div>
                    </div>

                  </div>
                  <button class="btn btn-warning mt-4 d-inline w-20" type="submit">Save Prescription</button>
                  <button class="btn btn-primary mt-4 d-inline w-20" type="submit">Save & Print</button>
                </form>
              </div>

            </div>
          </div>
        </div>

      </div>
    </div>
  </div>


  <!-- Modal -->
  <div class="modal fade" id="report1" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog ms-modal-dialog-width">
      <div class="modal-content ms-modal-content-width">
        <div class="modal-header  ms-modal-header-radius-0">
          <h4 class="modal-title text-white">Generate report</h4>
          <button type="button" class="close  text-white" data-dismiss="modal" aria-hidden="true">x</button>

        </div>
        <div class="modal-body p-0 text-left">
          <div class="col-xl-12 col-md-12">
            <div class="ms-panel ms-panel-bshadow-none">
              <div class="ms-panel-header">
                <h6>Patient Information</h6>
              </div>
              <div class="ms-panel-body">
                <form class="needs-validation" novalidate>
                  <div class="form-row">
                    <div class="col-md-4 mb-3">
                      <label for="validationCustom16">Patient Name</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom16" placeholder="Enter Name" required>

                      </div>
                    </div>
                    <div class="col-md-4 mb-3">
                      <label for="validationCustom17">Date Of Birth</label>
                      <div class="input-group">
                        <input type="number" class="form-control" id="validationCustom17" required>

                      </div>
                    </div>
                    <div class="col-md-4 mb-2">
                      <label for="validationCustom22">Address</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom22" placeholder="Add Address" required>

                      </div>
                    </div>

                  </div>
                  <div class="form-row">
                    <div class="col-md-4 mb-3">
                      <label for="validationCustom18">Phone no.</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom18" placeholder="Enter Phone No." required>

                      </div>

                    </div>

                    <div class="col-md-4 mb-3">
                      <label for="validationCustom19">Report Type</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom19" placeholder="Diseases Report" required>

                      </div>
                    </div>
                    <div class="col-md-4 mb-3">
                      <label for="validationCustom23">Report Period</label>
                      <div class="input-group">
                        <input type="number" class="form-control" id="validationCustom23" placeholder="" required>

                      </div>
                    </div>
                  </div>



                  <div class="form-row">

                    <div class="col-md-4 mb-3">
                      <label for="validationCustom20">Appointment With</label>
                      <div class="input-group">
                        <input type="text" class="form-control" id="validationCustom20" placeholder="Enter Doctor Name" required>

                      </div>
                    </div>

                  </div>
                  <button class="btn btn-warning mt-4 d-inline w-20" type="submit">Generate Report</button>
                  <button class="btn btn-primary mt-4 d-inline w-20" type="submit">Generate & Print</button>
                </form>
              </div>

            </div>
          </div>
        </div>

      </div>
    </div>
  </div>
  <!-- SCRIPTS -->
  <!-- Global Required Scripts Start -->
  <script src="../assets/js/jquery-3.3.1.min.js"></script>
  <script src="../assets/js/popper.min.js"></script>
  <script src="../assets/js/bootstrap.min.js"></script>
  <script src="../assets/js/perfect-scrollbar.js"> </script>
  <script src="../assets/js/jquery-ui.min.js"> </script>
  <!-- Global Required Scripts End -->

  <!-- Page Specific Scripts Start -->
  <script src="../assets/js/Chart.bundle.min.js"> </script>
  <script src="../assets/js/widgets.js"> </script>
  <!-- Page Specific Scripts End -->

  <!-- Mednalytics core JavaScript -->
  <script src="../assets/js/framework.js"></script>

  <!-- Settings -->
  <script src="../assets/js/settings.js"> </script>

</body>

</html>
